﻿<section id="home">
    <aside class="pa-sidebar well well-small">
        <div class="nav-header clearfix">
            <span>Messages</span>

            <input id="newMessage" type="checkbox" ng-model="IsNewConversationOpen" ng-change="IsNewConversationOpenChanged()" ng-disabled="!ActiveConversations || !Contacts" hidden />
            <label for="newMessage" class="btn btn-mini" ng-class="{disabled: !ActiveConversations || !Contacts}">New</label>
            <div class="popover right fade in">
                <div class="arrow"></div>

                <div class="popover-inner">
                    <h3 class="popover-title">Contacts</h3>
                    <div class="popover-content">
                        <input type="search" ng-model="ContactsFilterText" placeholder="Filter your contacts" />
                        <ul class="scroll"><!--
                         --><li ng-repeat="contact in Contacts | filter:ContactsFilterPredicate" ng-click="OpenConversation(contact)">
                                <user-avatar profile="contact" />
                            </li><!--
                     --></ul>
                    </div>
                </div>
            </div>
        </div>
        <ul class="left nav nav-list scroll auto-scroll">
            <li draggable="true" ui-sref-active="active" ng-repeat="conv in ActiveConversations">
                <a ng-if="!conv.IsNew" ui-sref="Home.TextConversation({convId:conv.Id})">
                    <user-avatar profile="conv.Receiver" hide-email="true" />
                </a>
                <a ng-if="conv.IsNew" ui-sref="Home.NewTextConversation({userId:conv.Receiver.Id})">
                    <user-avatar profile="conv.Receiver" hide-email="true" />
                </a>
                <div><div class="X" ng-click="CloseConversation($index)"></div></div>
            </li>
        </ul>
    </aside>
    <div class="right" ui-view="subView"></div>
</section>